<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">
    <title>管理信息系统课程设计 | MISP</title>
        <#include "/inc/head.ftl"/>
    	<@head/> 
</head>
<body>
    <div id="wrapper">
          <!-- Navigation -->
        <#include "/inc/nav.ftl"/>
		<@nav/>
        <div id="page-wrapper">
			<div class="row">
                <div class="col-lg-12">
                <div class="panel-body">
	                    <button id="btn-add"  type="button" class="btn btn-success">添加订单</button>
	                    <button id="btn-auth"  type="button" class="btn btn-danger">订单支付</button>
	                    <button id="btn-del"  type="button" class="btn btn-danger">删除订单</button>
	                    
                    </div>
                </div>
                <!-- /.col-lg-12 -->
            </div>
            <!-- /.row -->
            <div class="row">
                <div class="col-lg-12">
                    <div class="panel panel-default">
                        <div class="panel-heading">项目订单列表</div>
                        <!-- /.panel-heading -->
                        <div class="panel-body">
                            <table width="100%" class="table table-striped table-bordered table-hover" id="list">
                                <thead>
                                    <tr>
                                        <th>订单编号</th>
                                        <th>客户</th>
                                        <th>收银员</th>
                                        <th>总额</th>
                                        <th>实付金额</th>
                                        <th>时间</th>
                                        <th>支付方式</th>                         
                                    </tr>
                                </thead>
                                <tbody>
                                </tbody>
                            </table>
                            <!-- /.table-responsive -->
                        </div>
                        <!-- /.panel-body -->
                    </div>
                    <!-- /.panel -->
                </div>
                <!-- /.col-lg-12 -->
            </div>
           </div>
        <!-- /#page-wrapper -->
    </div>
    <!-- /#wrapper -->
    <!-- Page-Scripts  -->
    <script>
    $(document).ready(function() {
    	var table = $('#list').DataTable({
        	"ajax": '${contextPath}/orderform/list',
        	"language": {
    			"url": "${contextPath}/vendor/datatables/i18n/Chinese.json"
			},
            "columns": [
                 {"data": "orderformNumber"},
                 {"data": "customerName"},
                 {"data": "userName"},
                 {"data": "total"},
                 {"data": "payment"},
                 {"data": "time"},
                 {"data": "payName"}
                 
    	   ],
           responsive: true,
           select: true //datatables select 插件
        });
		
		/*添加订单按钮 */
    	$('#btn-add').click( function () {
    		layer.open({  //layer弹出层
    			  type: 2,
    			  title:"添加订单",
    			  area: ['400px', '570px'],
    			  fixed: false, //不固定
    			  maxmin: true,
    			  content: '${contextPath}/orderform/add',
    			  end : function(index){
    				  table.ajax.reload();
    			  }
    		});
        } ); 
    	
    	
    	/* 订单支付按钮 */
    	$('#btn-auth').click( function () {
    		var rowData =table.rows( { selected: true } ).data().toArray();
	   		 if(rowData.length==1){
	   			var orderformId = rowData[0].orderformId;
	   			layer.open({
	    			  type: 2,
	    			  title:"用户支付",
	    			  area: ['400px', '250px'],
	    			  fixed: false, //不固定
	    			  maxmin: true,
	    			  content:'${contextPath}/orderform/auth?orderformId='+orderformId,
	    			  end : function(index){
	    				  table.ajax.reload();
	    			  } 
	    		});
	   		 }else{
	   			 layer.msg('请选择一行!', {time: 1000, icon:7});
	   		 }
    	 });
    	
    	
    	/* 删除按钮 */
    	$('#btn-del').click( function () {
    		 var rowData =table.rows( { selected: true } ).data().toArray();  //得到datatables选中行的值并转成数组
    		 if(rowData.length==1){
    			 layer.msg('你确定删除该订单吗?', {time: 0 ,btn: ['确定', '取消'],yes: function(index){
	    			 	del(rowData[0].orderformId);
	    			 	layer.close(index);
		   				}
	   			});
    		 }else{
    			 layer.msg('请选择一行!', {time: 1000, icon:7});
    		 }
    	} ); 
    	
    	
    	/* 删除操作 */
    	function del(orderformId){
    			$.ajax({
    				type : "post",
    				url : "${contextPath}/orderform/delete",
    				dataType : "json",
    				data : { 
    					"orderformId" : orderformId
    				},
    				success : function(data) {
    					if (data.result){
    						layer.msg(data.msg, {time: 1000, icon:1});
        					table.ajax.reload();
    					}else{
    						layer.msg(data.msg, {time: 1000, icon:1});
        					table.ajax.reload();
    					}
    				},
    				error : function() {
    					layer.msg('系统出错!', {time: 1000, icon:2});
    				}
    			});
    	}	

    });

    </script>
    </body>
</html>

